
/**
 * 
 */

import ConstStrings from "./datas/strings";
import ScreenPositionUtil from "./ScreenPositionUtil";

var showZoneWID = 0; // 展示区域宽度
var showZoneHEI = 0; // 展示区域高度
var showZoneStartX = 0; // 展示区起始位置
var showZoneStartY = 0; // 展示区起始位置
var showZoneStartYRatio = 0.3; // 展示区Y起始位置纵向比例
var showZoneImageWHRatio = 0.68; // 原图宽高比例
var showZoneMarginLeftRight = 20;// 展示区域左右间隔  marginLeft marginRight

export default class ShowShoeZone extends Laya.Sprite {
    constructor() {
        super();

        this.showZoneData = {}; // 展示区域数据
        // 当前的面index 每双鞋有多个面 每个面包含多个拼图碎片区域
        this.selectedFaceIndex = 0;
        // 显示区域底图 用于显示鞋子轮廓地图
        this.viewBackOutLine = {};
        // 碎片区域list
        this.viewLayers = [];

        // 区域起始位置
        showZoneStartX = 0;
        showZoneStartY = ScreenPositionUtil.getPostionInStage(showZoneStartYRatio, "y");
        // 区域宽高
        showZoneWID = Laya.stage.width - (showZoneMarginLeftRight * 2);
        showZoneHEI = showZoneWID * showZoneImageWHRatio; // 鞋子原图宽高比例

        this.pos(showZoneStartX + showZoneMarginLeftRight, showZoneStartY);
        this.size(showZoneWID, showZoneHEI);
        // this.graphics.drawRect(0, 0, showZoneWID, showZoneHEI, "#ff000055")
    }

    getShowZoneEndPositionInStage() {
        return {
            x: showZoneStartX + showZoneWID,
            y: showZoneStartY + showZoneHEI,
        }
    }

    /**
     * 初始化展示区域
     * @param {*} inData 传入区域鞋子的数据
     */
    initShowZoneData(inData) {
        this.showZoneData = inData;

        this.destroyChildren();
        this.viewLayers = [];

        this.shoeShaderView = new Laya.Sprite();
        this.addChild(this.shoeShaderView);
        this.shoeShaderView.size(showZoneWID*1.05, showZoneWID / 5);
        this.shoeShaderView.pivot(this.shoeShaderView.width / 2 , this.shoeShaderView.height / 2);
        this.shoeShaderView.loadImage(ConstStrings.shoeShaderImg); // 面底图
        this.shoeShaderView.pos(showZoneWID / 2, showZoneHEI * 0.965); // 面底图
        this.shoeShaderView.visible = true;

        this.viewBackOutLine = new Laya.Sprite();
        this.addChild(this.viewBackOutLine);
        this.viewBackOutLine.size(showZoneWID, showZoneHEI);
        this.viewBackOutLine.loadImage(inData.outlineImg); // 面底图
        this.viewBackOutLine.visible = true;

        // 初始化碎片图层
        for (let i = 0; i < inData.partyLays.length; i++) {
            let temp = new PartLay();
            this.viewLayers.push(temp);
            this.viewBackOutLine.addChild(temp);
            temp.intLayer(inData.partyLays[i]);
        }

        this.shoeWholeImgView = new Laya.Sprite();
        this.addChild(this.shoeWholeImgView);
        this.shoeWholeImgView.size(showZoneWID, showZoneHEI);
        this.shoeWholeImgView.loadImage(inData.wholeImg); // 面底图
        this.shoeWholeImgView.visible = false;
    }

    /**
     * 获取指定碎片的候选数据
     * @param {*} e 
     */
    getCandidateDataByType(e) {
        for (var i = 0; i < this.showZoneData.partyLays.length; i++) {
            let tempData = this.showZoneData.partyLays[i];
            if (tempData.type == e)
                return tempData;
        }
        return null;
    }

    /**
     * 更新碎片的选中数据
     * @param {*} inType 碎片类型
     * @param {*} inData 候选数据
     */
    updatePartLayByData(inType, inData) {
        for (let i = 0; i < this.viewLayers.length; i++) {
            let tempLayer = this.viewLayers[i];
            let tempLayerData = tempLayer.partLayData;
            if (tempLayerData.type == inType) {
                tempLayer.setCandidataData(inData);
                if (inData == null) {
                    Laya.Tween.from(this.viewBackOutLine, { x: this.viewBackOutLine.x + this.viewBackOutLine.width * 0.03 }, 600, Laya.Ease.elasticOut, null, 300);
                }
            }
        }
    }

    /**
     * 判断是否选择完成
     */
    checkIsSelectFinish() {
        for (let i = 0; i < this.viewLayers.length; i++) {
            let tempLayer = this.viewLayers[i];
            if (tempLayer.candidataData == null)
                return false;
        }

        return true;
    }

    /**
     * 判断是否选择正确
     */
    checkIsSelectRight() {
        for (let i = 0; i < this.viewLayers.length; i++) {
            let tempLayer = this.viewLayers[i];
            if (tempLayer.candidataData == null || tempLayer.candidataData.isRight == null || !tempLayer.candidataData.isRight)
                return false;
        }

        return true;
    }

    /**
     * 选中tab后 对应的区域闪烁
     * @param {*} inType 
     */
    actionToShowPartOutLine(inType, isError) {
        for (let i = 0; i < this.viewLayers.length; i++) {
            let tempLayer = this.viewLayers[i];
            let tempLayerData = tempLayer.partLayData;
            if (tempLayerData.type == inType) {
                // tempLayer.twinkleOutline(isError);
                tempLayer.isShowOutLine(true)
            } else {
                tempLayer.isShowOutLine(false)
            }

        }
    }

    showWholeImg(e) {
        this.shoeWholeImgView.alpha = 0;
        this.shoeWholeImgView.visible = true;
        Laya.Tween.to(this.shoeWholeImgView, { alpha: 1 }, 800, Laya.Ease.quartOut , null ,1000);
    }
}

/**
 * 碎片图层
 */
class PartLay extends Laya.Sprite {
    constructor() {
        super();
        this.partLayData = null;
        this.candidataData = null;


        // 轮廓图mask
        // this.viewPartLayOutLineMaskImg = {};
        // 轮廓图view line
        this.viewPartLayOutLineImg = {};
        // 全图view 
        this.viewPartLayWholeImg = {};
        // 区域多边形
        this.viewPartLayPolygon = {};

        this.size(showZoneWID, showZoneHEI);

        // this.intLayer();
    }

    intLayer(inData) {
        this.candidataData = null;
        this.partLayData = inData;


        this.viewPartLayWholeImg = new Laya.Sprite();
        this.addChild(this.viewPartLayWholeImg);
        this.viewPartLayWholeImg.size(showZoneWID, showZoneHEI);
        this.viewPartLayWholeImg.visible = true;

        this.viewPartLayOutLineImg = new Laya.Sprite();
        this.addChild(this.viewPartLayOutLineImg);
        this.viewPartLayOutLineImg.size(showZoneWID, showZoneHEI);
        this.viewPartLayOutLineImg.loadImage(this.partLayData.outlineImg)

        this.viewPartLayErrorImg = new Laya.Sprite();
        this.addChild(this.viewPartLayErrorImg);
        this.viewPartLayErrorImg.size(showZoneWID, showZoneHEI);
        this.viewPartLayErrorImg.loadImage(this.partLayData.errorImg)
        this.viewPartLayErrorImg.alpha = 0;
    }

    setCandidataData(inData) {
        this.candidataData = inData;
        if (this.candidataData == null) {
            this.viewPartLayWholeImg.loadImage(null);
            this.twinkleError();
            Laya.Tween.to(this.viewPartLayOutLineImg, { alpha: 1 }, 400, Laya.Ease.quartOut);
        } else {
            this.viewPartLayWholeImg.loadImage(inData.res);
            this.viewPartLayWholeImg.alpha = 0;
            Laya.Tween.to(this.viewPartLayWholeImg, { alpha: 1 }, 800, Laya.Ease.quartOut);
            Laya.Tween.to(this.viewPartLayOutLineImg, { alpha: 0 }, 400, Laya.Ease.quartOut);
        }
    }

    twinkleError() {
        Laya.Tween.to(this.viewPartLayErrorImg, { alpha: 1 }, 150, Laya.Ease.quartOut, null, 0);
        Laya.Tween.to(this.viewPartLayErrorImg, { alpha: 0 }, 150, Laya.Ease.quartOut, null, 150);
        Laya.Tween.to(this.viewPartLayErrorImg, { alpha: 1 }, 150, Laya.Ease.quartOut, null, 300);
        Laya.Tween.to(this.viewPartLayErrorImg, { alpha: 0 }, 150, Laya.Ease.quartOut, null, 450);
    }

    isShowOutLine(isShow) {
        this.viewPartLayOutLineImg.visible = isShow;
    }
}